<html>
<head>
<style>
@page {
  @top-center {
  	font-family: sans-serif;
  	font-style: italic;
  	font-size: 14px;
  	content: "Page " counter(page);
  }
  @bottom-center {
    font-family: sans-serif;
    font-size: 10px;
    content: "Thanks for reading";
  }
}
body {
  font-family: sans-serif;
  font-size: 15px;
  line-height: 19px;
}
pre {
  font-family: monospace;
  font-size: 16px;
  line-height: 19px;
  background-color: #f8f8f8;
  padding: 6px;
  border-radius: 4px;
}
svg {

}
li {
 margin-bottom: 6px;   
}
li > ul {
  margin-top: 10px;
}
a[href] {
  text-decoration: none;
  border-bottom: 1px dashed blue;
  line-height: 18px;
}
h1 {
  font-weight: normal;
  font-size: 28px;
  text-align: center;
}
h2 {
  padding-top: 25px;
  padding-bottom: 20px;
  border-top: 1px solid gray;
  font-size: 25px;
  font-weight: normal;
}
h3 {
  font-size: 20px;
  font-weight: normal;
}
math { width: 100%; }


/* For borders example: */
.brdr {
  display: inline-block;
  width: 80px;
  height: 80px;	
  margin: 10px;
  border-radius: 8px;
}
#o1 { border: 10px hidden red; }
#o2 { border: 10px dotted red; }
#o3 { border: 10px dashed red; }
#o4 { border: 10px solid red; }
#o5 { border: 10px double red; }
#o6 { border: 10px groove red; }
#o7 { border: 10px ridge red; }
#o8 { border: 10px inset red; }
#o9 { border: 10px outset red; }
</style>
</head>
<body>

